import { listInterfaceInfoByPageUsingGET } from "@/services/swagger/interfaceInfoController";
import { PageContainer } from '@ant-design/pro-components';
import { List,message } from 'antd';
import React,{ useEffect,useState } from 'react';

/**
 * 每个单独的卡片，为了复用样式抽成了组件
 * @param param0
 * @returns
 */

const Index: React.FC = () => {

  const [initLoading, setInitLoading] = useState(true);
  const [list, setList] = useState<API.InterfaceInfo[]>([]);
  const [total,setTotal] = useState(0)

  const initDate = async (current = 1 ,pageSize = 5) => {
    setInitLoading(true);
    try {
      const res =  await listInterfaceInfoByPageUsingGET({current, pageSize});
      if(res.data){
        setList(res?.data?.records ?? []);
        setTotal(res?.data?.total ?? 0)
      }
    } catch (error:any) {
      message.error('Delete failed, please try again');
    }
    setInitLoading(false)
  }


  useEffect(() => {
    initDate()
  },[]);

  return (
    <PageContainer>
      <List
        className="demo-loadmore-list"
        loading={initLoading}
        itemLayout="horizontal"
        dataSource={list}
        renderItem={(item) => {
          const apiLink = `/interface_info/${item.id}`
          return(
          <List.Item
            actions={[<a key={item.id} href={apiLink}>查看</a>]}
          >
              <List.Item.Meta
                title={<a href={apiLink}>{item.name}</a>}
                description={item.description}
              />
          </List.Item>
          )
        }}
        pagination={{
          showTotal(total) {
            return '总数' + total
            },
          pageSize: 5,
          total,
          onChange(page ,pageSize ){
            initDate(page,pageSize)
          }
        }}
      />
    </PageContainer>
  );
};

export default Index;
